<template>

  <div class="qita">
      <div class="qitalianxi">其他方式登录</div>
      <div class="dengluxiang">
          <div class="xuanx" id="huaweiss">HONOR</div>
          <div class="xuanx"><span class="iconfont icon-weixin"></span></div>
          <div class="xuanx"><span class="iconfont icon-weixin"></span></div>
          <div class="xuanx"><span class="iconfont icon-weibo"></span></div>
      </div>
      <div class="yingsi">
          <div class="yudaowenti">遇到问题</div>
          <div class="ysshengming">隐私声明</div>

      </div>
  </div>
  

</template>

<script>
export default {

}
</script>

<style scoped>
.qita{
    display: flex;
    align-items: center;
    flex-direction: column;
    width: 100%;
    height: 1.8rem;
    background: #fff;
}
.qitalianxi{
    width: 95%;
    height: .3rem;
    font-size: .2rem;
    text-align: center;
    
}
.dengluxiang{
    display: flex;
    justify-content: center;
    width: 95%;
    height: .6rem;
}
.xuanx{
    display: flex;
    align-items: center;
    justify-content: center;
    width: .6rem;
    height: .6rem;
    border: .01rem solid black;
    border-radius: 50%;
}
#huaweiss{
    font-size: .1rem;
}
.xuanx .iconfont{
    font-size: .4rem;
}
.yingsi{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 95%;
    height: .4rem;
}
.yudaowenti{
    width: 1rem;
    height: .3rem;
    border-right: .01rem solid black;
    text-align: center;
    line-height: .3rem;
    font-size: .1rem;
    color:blue
}
.ysshengming{
    width: 1rem;
    height: .4rem;
    text-align: center;
    font-size: .1rem;
    line-height: .4rem;
    color:blue
}
</style>